
<template>
  <div class="resource-main-box  new-page">
    <a-form-model layout="inline" :model="search" class="comm-search-f" :style="`width: calc(100% - ${sideMenuWidth} - 33px)`">

      <!-- 筛选条件与查询 -->
      <!-- 机型 -->
      <a-form-model-item label="">
        <airModel v-model="search.model" mode="multiple" />
      </a-form-model-item>

      <!-- 机号 -->
      <a-form-model-item label="">
        <tailNumber v-model="search.tailnumber" style="minWidth: 100%" value-key="tailnumber" name-key="tailnumber" mode="multiple" />
      </a-form-model-item>

      <a-form-model-item label="">
        <a-select
          v-model="search.assetType"
          show-arrow
          style="minWidth: 100%"
          placeholder="资产类型"
        >
          <a-icon slot="suffixIcon" :component="require('@/assets/icon/arrow-down-bold.svg')" />
          <a-select-option v-for="item in assetTypeList" :key="item.id" :value="item.name">
            {{ item.name }}
          </a-select-option>
        </a-select>
      </a-form-model-item>
      <a-form-model-item label="">
        <a-date-picker
          v-model="search.startTime"
          style="width: 100%;min-width: 100%;"
          format="YYYY-MM-DD HH:mm:ss"
          value-format="YYYY-MM-DD HH:mm:ss"
          placeholder="起始时间"
          show-time
          :disabled-date="disabledStartDate"
          :get-calendar-container="triggerNode =>triggerNode.parentNode"
        />
      </a-form-model-item>
      <a-form-model-item label="">
        <a-date-picker
          v-model="search.endTime"
          style="width: 100%;min-width: 100%;"
          format="YYYY-MM-DD HH:mm:ss"
          value-format="YYYY-MM-DD HH:mm:ss"
          placeholder="结束时间"
          show-time
          :disabled-date="disabledEndDate"
          :get-calendar-container="triggerNode =>triggerNode.parentNode"
        />
      </a-form-model-item>
      <a-form-model-item label="">
        <a-input
          v-model="search.serialNumber"
          placeholder="序号"
        />
        <!-- <eventCodeList v-model="search.code" value-key="value" mode="default"        style="minWidth: 100%" /> -->
      </a-form-model-item>

      <a-form-model-item class="flex-1" style="max-width:100%!important">
        <a-button type="default" ghost :loading="getEngineApuInfoListLoading" @click="resetSearchHandler">
          重置
        </a-button>
        <a-button type="primary" class="ml-8" :loading="getEngineApuInfoListLoading" @click="changeTable({ current: 1 })">
          查询
        </a-button>

      </a-form-model-item>
    </a-form-model>

    <!-- table -->
    <div>

      <a-table
        class="table-border"
        :columns="columns"
        size="middle"
        :data-source="engineApuInfoList"
        :row-key="(row,index) => row.id"
        :pagination="{
          showTotal:(total)=> `共 ${total} 条数据`,
          showSizeChanger: true,//设置每页显示数据条数
          showQuickJumper: true,
          size:'big',
          current:paginationOptions.pageNum,
          pageSize:paginationOptions.pageSize,
          total:paginationOptions.total
        }"
        :loading="getEngineApuInfoListLoading"
        @change="changeTable"
      />

    </div>

  </div>
</template>

<script>
import { mapState, mapActions, mapMutations, mapGetters } from 'vuex';
import rowClass from '@/pages/common/rowClass';
import tailNumber from '@/pages/components/tailNumber';
import airModel from '@/pages/components/airModel';
export default {
  components: {
    tailNumber,
    airModel
  },
  mixins: [rowClass],
  data() {
    return {
      search: {},
      typeFlag: ''
    };
  },
  computed: {
    ...mapState('wingEngineAndApuInformation', [
      'paginationOptions',
      'getEngineApuInfoListLoading',
      'engineApuInfoList',
      'assetTypeList'
    ]),

    ...mapGetters('setting', ['sideMenuWidth']),

    columns() {
      if (this.typeFlag === 'APU') {
        return Object.freeze([

          {
            title: '机号',
            align: 'left',
            dataIndex: 'tailNumber',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'APUC序号',
            align: 'left',
            dataIndex: 'apucSn',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'APUC软件号',
            align: 'left',
            dataIndex: 'apucSwid',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'APUC件号',
            align: 'left',
            dataIndex: 'apucPn',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'APUC运行时长',
            align: 'left',
            dataIndex: 'apucHrs',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'APU序号',
            align: 'left',
            dataIndex: 'apuSn',
            customRender: (value) => {
              return value || '--';
            }
          },

          {
            title: '安装日期',
            align: 'left',
            dataIndex: 'installTime',
            customRender: (value) => {
              return value ? this.$moment.utc(value).format('YYYY-MM-DD HH:mm') : '--';
            }
          },
          {
            title: '最后报告日期',
            align: 'left',
            dataIndex: 'lastedReportTime',
            customRender: (value) => {
              return value ? this.$moment.utc(value).format('YYYY-MM-DD HH:mm') : '--';
            }
          },
          {
            title: '移除时间(估计)',
            align: 'left',
            dataIndex: 'estimateRemoveTime',
            customRender: (value) => {
              return value ? this.$moment.utc(value).format('YYYY-MM-DD HH:mm') : '--';
            }
          },
          {
            title: '安装前循环次数',
            align: 'left',
            dataIndex: 'beforeCycleNumber',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '总循环次数',
            align: 'left',
            dataIndex: 'totalCycleNumber',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '循环次数',
            align: 'left',
            dataIndex: 'cycleNumber',
            customRender: (value) => {
              return value || '--';
            }
          },

          {
            title: '安装前运行时长',
            align: 'left',
            dataIndex: 'beforeRunTime',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '总运行时长',
            align: 'left',
            dataIndex: 'totalRunTime',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '空中运行时长',
            align: 'left',
            dataIndex: 'skyRunTime',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '地面运行时长',
            align: 'left',
            dataIndex: 'groundRunTime',
            customRender: (value) => {
              return value || '--';
            }
          }

        ]);
      } else {
        return Object.freeze([

          {
            title: '机号',
            align: 'left',
            dataIndex: 'tailNumber',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '发动机位置',
            align: 'left',
            dataIndex: 'pos',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '发动机序号',
            align: 'left',
            dataIndex: 'serNo',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'EEC件号',
            align: 'left',
            dataIndex: 'eecHwpn',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: 'EEC OPS 软件号',
            align: 'left',
            dataIndex: 'eecSwpn',
            customRender: (value) => {
              return value || '--';
            }
          },
          {
            title: '最新报告时间',
            align: 'left',
            dataIndex: 'lastedReportTime',
            customRender: (value) => {
              return value || '--';
            }
          }

        ]);
      }
    }

  },
  async mounted() {
    await this.getAssetTypeList();
    this.$set(this.search, 'assetType', 'ENGINE');
    this.typeFlag = 'ENGINE';
    this.changeTable({ current: 1 });
  },
  methods: {
    ...mapMutations('wingEngineAndApuInformation', [
      'setState'
    ]),
    ...mapActions('wingEngineAndApuInformation', [
      'getEngineApuInfoList',
      'getAssetTypeList'
    ]),

    changeTable({ current, pageSize = 10 }) {
      if (pageSize !== this.paginationOptions.pageSize) {
        current = 1;
      }
      this.setState({ key: 'paginationOptions', payload: { ...this.paginationOptions, pageNum: current, pageSize }});
      this.getData(this.search);
    },

    // changeTailnumber() {
    //   const msg = this.repUplinkRequest.find(item => item.name === this.addForm?.uplinkRequest)?.message ?? '';
    //   this.addForm['message'] = this.addForm.tailnumber + '\n' + msg;
    // },
    // changeModifier(v) {
    //   const msg = this.repUplinkRequest.find(item => item.name === this.addForm?.uplinkRequest)?.message ?? '';

    //   const formatM = modifierArr.find(item => item.name === v).format;

    //   const tn = this.addForm.tailnumber ? this.addForm.tailnumber + '\n' : '';
    //   this.addForm['message'] = tn + msg + formatM;
    // },
    // 重置
    disabledStartDate(startValue) {
      const endValue = this.search.endTime;
      if (!startValue || !endValue) {
        return false;
      }
      return startValue.valueOf() > new Date(endValue).getTime().valueOf();
    },

    disabledEndDate(endValue) {
      const startValue = this.search.startTime;
      if (!endValue || !startValue) {
        return false;
      }
      return new Date(startValue).getTime().valueOf() >= endValue.valueOf();
    },
    resetSearchHandler() {
      this.search = {};
      this.$set(this.search, 'assetType', 'ENGINE');
      this.typeFlag = 'ENGINE';
      this.changeTable({ current: 1 });
    },
    // changeUplinkRequestHandler() {
    //   this.$set(this.addForm, 'modifier', undefined);
    //   const msg = this.repUplinkRequest.find(item => item.name === this.addForm?.uplinkRequest)?.message ?? '';
    //   this.addForm['message'] = this.addForm.tailnumber ? this.addForm.tailnumber + '\n' + msg : msg;
    // },
    async getData() {
      const params = {
        ...this.search
      };

      for (const key in params) {
        if (Object.hasOwnProperty.call(params, key)) {
          const element = params[key];
          if (!element || (element.push && element.length === 0)) {
            delete params[key];
          }
        }
      }

      await this.getEngineApuInfoList(params);
      this.typeFlag = this.search.assetType;
    }
  }
};
</script>

<style lang="less">
@import 'index.less';
</style>
